body {
    margin            : 0px;
    padding           : 0px;
    font-size         : 14px;
    text-align        : center;
    font-family       : Comic Sans MS, Verdana, sans;
}

input:focus {
    background-color: yellow;
}

form {
    width: 50%;
    margin: auto auto;
    padding-top: 50px;
    font-size: 26px;
    text-align: left;
}

form .input-text {
    font-size: 26px;
    border: 1px solid black;
    width: 100%;
}

form .button {
    float: right;
}

#top {
    font-family       : Helvetica Neue, Helvetica, Arial;
    text-align       : left;
    height           : 30px;
    color            : #ffffff;
    border-bottom    : 1px solid #009966;
    background-color : #99cccc;
}

#tittle {
    font-size    : 25px;
    margin       : 0px;
    margin-left  : 5px;
    margin-right : 5px;
}

#menu {
    position : absolute;
    float    : left;
    top      : 6px;
    right    : 6px;
    display  : table-row;
}

#start {
    color: green;
}

#stop {
    color: red;
}

#letter {
    width         : 100%;
    font-size     : 140px;
    padding       : 0;
    margin        : 0;
    color         : #009966;
}

#letter-box {
    width         : 70%;
    margin        : auto;
    margin-top    : 20px;
    margin-bottom : 30px;
    text-align    : center;
}

#letters {
    font-family   : monospace;
    font-weight   : bold;
    width         : 70%;
    margin        : auto;
    text-align    : center;
}

.alert {
    color: #cc6666;
}

.button {
    vertical-align: middle;
    width         : 150px;
    height        : 17px;
    font-family   : monospace;
    font-size     : 12px;
    border        : none;
    margin        : 0px;
    padding       : 0px;
    padding-left  : 5px;
    padding-right : 5px;
    background    : url(botao.jpg) repeat-x;
    color         : #000;
    cursor        : pointer;
}

a.button {
    display: inline-block;
    text-decoration : none;
}

